
cc.Class({
    extends: cc.Component,

    properties: {
        cornerSize: 30, // 每个角裁剪的像素大小
        targetSprite: {
            type: cc.Sprite,
            default: null,
            tooltip: "需要裁剪的头像Sprite"
        }
    },

    onLoad() {
        this._createClippedNode();
    },

    _createClippedNode() {
        // 1. 创建裁切模板
        console.log("创建裁剪模板节点");
        const stencilNode = new cc.Node('Stencil');
        const graphics = stencilNode.addComponent(cc.Graphics);
        
        // 2. 计算八边形路径
        const width = 144;
        const height = 144;
        const cut = this.cornerSize;

        graphics.moveTo(cut, 0); // 从左上裁剪点开始
        graphics.lineTo(width - cut, 0);
        graphics.lineTo(width, cut);
        graphics.lineTo(width, height - cut);
        graphics.lineTo(width - cut, height);
        graphics.lineTo(cut, height);
        graphics.lineTo(0, height - cut);
        graphics.lineTo(0, cut);
        graphics.close();
        graphics.fill();

        // 3. 创建裁剪容器
        const clippingNode = new cc.Node('ClippedAvatar');
        const clippingComp = clippingNode.addComponent(cc.Mask);
        clippingComp.type = cc.Mask.Type.GRAPHICS_STENCIL;
        clippingNode.parent = this.node;

        // 4. 转移原Sprite到裁剪容器
        if (this.targetSprite) {
            this.targetSprite.node.parent = clippingNode;
            this.targetSprite.node.position = cc.Vec2.ZERO;
        }

        // 5. 同步模板节点
        stencilNode.parent = clippingNode;
        stencilNode.zIndex = 1;
    }
});